import "./HomeIcon.scss";
import React, { Component } from "react";
import PropTypes from "prop-types";
export default class HomeIcon extends Component {
    constructor() {
        super();
        this.state = {
            icons: [],
        };
    }
    static propTypes = {
        icons: PropTypes.array,
    };
    static defaultProps = {
        icons: [],
    };
    UNSAFE_componentWillMount() {
        this.setState({
            icons: this.props.icons,
        });
    }
    UNSAFE_componentWillReceiveProps(props) {
        this.setState({
            icons: props.icons,
        });
    }
    render() {
        const { icons } = this.state;
        return (
            <div className="HomeIcon mt-10">
                <div className="icon-wrap">
                    {icons.map(item => (
                        <div key={item._id} className="iconItem">
                            <div style={{ backgroundImage: `url(${process.env.REACT_APP_FILE}/${item.icon})` }}></div>
                            <div>{item.name}</div>
                        </div>
                    ))}
                    {new Array(icons.length % 5).fill(null).map((item, index) => (
                        <div key={index} className="iconItem"></div>
                    ))}
                </div>
            </div>
        );
    }
}
